<!--<template>-->
<!--  <div class="frequent-mistakes">-->
<!--    <div class="layout-container">-->
<!--      &lt;!&ndash; 侧边栏 &ndash;&gt;-->
<!--      &lt;!&ndash; <div class="sidebar">-->
<!--        <div class="sidebar-header">-->
<!--          <h3>习题管理</h3>-->
<!--        </div>-->
<!--        <el-menu-->
<!--          :default-active="activeMenu"-->
<!--          class="sidebar-menu"-->
<!--          @select="handleMenuSelect"-->
<!--        >-->
<!--          <el-menu-item index="generator">-->
<!--            <el-icon><Edit /></el-icon>-->
<!--            <span>习题定制</span>-->
<!--          </el-menu-item>-->
<!--          <el-menu-item index="history">-->
<!--            <el-icon><List /></el-icon>-->
<!--            <span>历史记录</span>-->
<!--          </el-menu-item>-->
<!--          <el-menu-item index="hot">-->
<!--            <el-icon><Star /></el-icon>-->
<!--            <span>热点考题</span>-->
<!--          </el-menu-item>-->
<!--          <el-menu-item index="mistakes">-->
<!--            <el-icon><Warning /></el-icon>-->
<!--            <span>高频错题</span>-->
<!--          </el-menu-item>-->
<!--        </el-menu>-->
<!--      </div> &ndash;&gt;-->

<!--      &lt;!&ndash; 主内容区 &ndash;&gt;-->
<!--      <div class="main-content">-->
<!--        <el-card class="mistakes-card">-->
<!--          <template #header>-->
<!--            <div class="card-header">-->
<!--              <h2>高频错题</h2>-->
<!--            </div>-->
<!--          </template>-->
<!--          -->
<!--          &lt;!&ndash; 筛选区域 &ndash;&gt;-->
<!--          <div class="filter-section">-->
<!--            <el-form :model="filterForm" label-width="100px" inline>-->
<!--              <el-form-item label="学习阶段">-->
<!--                <el-select v-model="filterForm.stage" placeholder="请选择学习阶段">-->
<!--                  <el-option label="小学" value="primary" />-->
<!--                  <el-option label="初中" value="junior" />-->
<!--                  <el-option label="高中" value="senior" />-->
<!--                </el-select>-->
<!--              </el-form-item>-->

<!--              <el-form-item label="学科">-->
<!--                <el-select v-model="filterForm.subject" placeholder="请选择学科">-->
<!--                  <el-option-->
<!--                    v-for="subject in availableSubjects"-->
<!--                    :key="subject.value"-->
<!--                    :label="subject.label"-->
<!--                    :value="subject.value"-->
<!--                  />-->
<!--                </el-select>-->
<!--              </el-form-item>-->

<!--              <el-form-item label="错题类型">-->
<!--                <el-select v-model="filterForm.mistakeType" placeholder="请选择错题类型">-->
<!--                  <el-option label="概念理解错误" value="concept" />-->
<!--                  <el-option label="计算错误" value="calculation" />-->
<!--                  <el-option label="解题思路错误" value="thinking" />-->
<!--                  <el-option label="知识点遗漏" value="knowledge" />-->
<!--                </el-select>-->
<!--              </el-form-item>-->

<!--              <el-form-item>-->
<!--                <el-button type="primary" @click="handleSearch">查询</el-button>-->
<!--                <el-button @click="handleReset">重置</el-button>-->
<!--              </el-form-item>-->
<!--            </el-form>-->
<!--          </div>-->

<!--          &lt;!&ndash; 统计信息 &ndash;&gt;-->
<!--          <div class="stats-section">-->
<!--            <el-row :gutter="20">-->
<!--              <el-col :span="6">-->
<!--                <el-card shadow="hover" class="stats-card">-->
<!--                  <template #header>-->
<!--                    <div class="stats-header">-->
<!--                      <span>总错题数</span>-->
<!--                      <el-icon><Warning /></el-icon>-->
<!--                    </div>-->
<!--                  </template>-->
<!--                  <div class="stats-value">{{ stats.totalMistakes }}</div>-->
<!--                </el-card>-->
<!--              </el-col>-->
<!--              <el-col :span="6">-->
<!--                <el-card shadow="hover" class="stats-card">-->
<!--                  <template #header>-->
<!--                    <div class="stats-header">-->
<!--                      <span>平均错误率</span>-->
<!--                      <el-icon><DataLine /></el-icon>-->
<!--                    </div>-->
<!--                  </template>-->
<!--                  <div class="stats-value">{{ stats.averageErrorRate }}%</div>-->
<!--                </el-card>-->
<!--              </el-col>-->
<!--              <el-col :span="6">-->
<!--                <el-card shadow="hover" class="stats-card">-->
<!--                  <template #header>-->
<!--                    <div class="stats-header">-->
<!--                      <span>最常见错题类型</span>-->
<!--                      <el-icon><TrendCharts /></el-icon>-->
<!--                    </div>-->
<!--                  </template>-->
<!--                  <div class="stats-value">{{ stats.mostCommonType }}</div>-->
<!--                </el-card>-->
<!--              </el-col>-->
<!--              <el-col :span="6">-->
<!--                <el-card shadow="hover" class="stats-card">-->
<!--                  <template #header>-->
<!--                    <div class="stats-header">-->
<!--                      <span>已掌握题目</span>-->
<!--                      <el-icon><Check /></el-icon>-->
<!--                    </div>-->
<!--                  </template>-->
<!--                  <div class="stats-value">{{ stats.masteredQuestions }}</div>-->
<!--                </el-card>-->
<!--              </el-col>-->
<!--            </el-row>-->
<!--          </div>-->

<!--          &lt;!&ndash; 错题列表 &ndash;&gt;-->
<!--          <div class="mistakes-list">-->
<!--            <el-card v-for="(mistake, index) in mistakes" :key="index" class="mistake-card">-->
<!--              <template #header>-->
<!--                <div class="mistake-header">-->
<!--                  <span class="mistake-type">{{ getMistakeTypeLabel(mistake.type) }}</span>-->
<!--                  <span class="mistake-number">第 {{ index + 1 }} 题</span>-->
<!--                </div>-->
<!--              </template>-->
<!--              <div class="mistake-content">-->
<!--                <p class="mistake-text">{{ mistake.content }}</p>-->
<!--                <div v-if="mistake.options" class="mistake-options">-->
<!--                  <div v-for="(option, key) in mistake.options" :key="key" class="option-item">-->
<!--                    {{ key }}. {{ option }}-->
<!--                  </div>-->
<!--                </div>-->
<!--                <div class="mistake-answer">-->
<!--                  <p><strong>正确答案：</strong>{{ mistake.correctAnswer }}</p>-->
<!--                  <p><strong>错误原因：</strong>{{ mistake.errorReason }}</p>-->
<!--                  <p><strong>解题思路：</strong>{{ mistake.solution }}</p>-->
<!--                </div>-->
<!--                <div class="mistake-stats">-->
<!--                  <el-tag type="danger" size="small">错误次数: {{ mistake.errorCount }}</el-tag>-->
<!--                  <el-tag type="warning" size="small">错误率: {{ mistake.errorRate }}%</el-tag>-->
<!--                  <el-tag type="success" size="small">掌握度: {{ mistake.masteryLevel }}%</el-tag>-->
<!--                </div>-->
<!--              </div>-->
<!--            </el-card>-->
<!--          </div>-->

<!--          &lt;!&ndash; 分页 &ndash;&gt;-->
<!--          <div class="pagination-container">-->
<!--            <el-pagination-->
<!--              v-model:current-page="currentPage"-->
<!--              v-model:page-size="pageSize"-->
<!--              :page-sizes="[10, 20, 50, 100]"-->
<!--              layout="total, sizes, prev, pager, next, jumper"-->
<!--              :total="total"-->
<!--            ></el-pagination>-->
<!--          </div>-->
<!--        </el-card>-->
<!--      </div>-->
<!--    </div>-->
<!--  </div>-->
<!--</template>-->

<!--<script setup>-->
<!--import { ref, computed, onMounted, reactive, watch } from 'vue'-->
<!--import { useRouter } from 'vue-router'-->
<!--import { ElMessage } from 'element-plus'-->
<!--import { Edit, List, Document, Star, Warning, DataLine, TrendCharts, Check } from '@element-plus/icons-vue'-->
<!--import { getFrequentMistakes } from '@/api/homework'-->

<!--const router = useRouter()-->
<!--const activeMenu = ref('mistakes')-->

<!--const filterForm = ref({-->
<!--  stage: '',-->
<!--  subject: '',-->
<!--  mistakeType: ''-->
<!--})-->

<!--const mistakes = ref([])-->
<!--const stats = ref({-->
<!--  totalMistakes: 0,-->
<!--  averageErrorRate: 0,-->
<!--  mostCommonType: '',-->
<!--  masteredQuestions: 0-->
<!--})-->
<!--const currentPage = ref(1)-->
<!--const pageSize = ref(10)-->
<!--const total = ref(0)-->

<!--// 根据学习阶段获取可用学科-->
<!--const availableSubjects = computed(() => {-->
<!--  const subjects = {-->
<!--    primary: [-->
<!--      { label: '语文', value: 'chinese' },-->
<!--      { label: '数学', value: 'math' },-->
<!--      { label: '英语', value: 'english' }-->
<!--    ],-->
<!--    junior: [-->
<!--      { label: '语文', value: 'chinese' },-->
<!--      { label: '数学', value: 'math' },-->
<!--      { label: '英语', value: 'english' },-->
<!--      { label: '科学', value: 'science' },-->
<!--      { label: '社会', value: 'society' }-->
<!--    ],-->
<!--    senior: [-->
<!--      { label: '语文', value: 'chinese' },-->
<!--      { label: '数学', value: 'math' },-->
<!--      { label: '英语', value: 'english' },-->
<!--      { label: '政治', value: 'political' },-->
<!--      { label: '历史', value: 'history' },-->
<!--      { label: '地理', value: 'geography' },-->
<!--      { label: '物理', value: 'physics' },-->
<!--      { label: '化学', value: 'chemistry' },-->
<!--      { label: '生物', value: 'biology' }-->
<!--    ]-->
<!--  }-->
<!--  return subjects[filterForm.value.stage] || []-->
<!--})-->

<!--// 获取错题类型标签-->
<!--const getMistakeTypeLabel = (type) => {-->
<!--  const typeMap = {-->
<!--    'concept': '概念理解错误',-->
<!--    'calculation': '计算错误',-->
<!--    'thinking': '解题思路错误',-->
<!--    'knowledge': '知识点遗漏'-->
<!--  }-->
<!--  return typeMap[type] || type-->
<!--}-->

<!--// 获取高频错题列表-->
<!--const fetchMistakes = async () => {-->
<!--  try {-->
<!--    const params = {-->
<!--      page: currentPage.value,-->
<!--      pageSize: pageSize.value,-->
<!--      ...filterForm.value-->
<!--    }-->
<!--    -->
<!--    const response = await getFrequentMistakes(params)-->
<!--    mistakes.value = response.data.list-->
<!--    stats.value = response.data.stats-->
<!--    total.value = response.data.total-->
<!--  } catch (error) {-->
<!--    console.error('获取高频错题失败:', error)-->
<!--    ElMessage.error('获取高频错题失败')-->
<!--  }-->
<!--}-->

<!--// 处理查询-->
<!--const handleSearch = () => {-->
<!--  currentPage.value = 1-->
<!--  fetchMistakes()-->
<!--}-->

<!--// 处理重置-->
<!--const handleReset = () => {-->
<!--  filterForm.value = {-->
<!--    stage: '',-->
<!--    subject: '',-->
<!--    mistakeType: ''-->
<!--  }-->
<!--  handleSearch()-->
<!--}-->

<!--// 处理菜单选择-->
<!--const handleMenuSelect = (index) => {-->
<!--  activeMenu.value = index-->
<!--  switch (index) {-->
<!--    case 'generator':-->
<!--      router.push('/homework/generator')-->
<!--      break-->
<!--    case 'history':-->
<!--      router.push('/homework/history')-->
<!--      break-->
<!--    case 'hot':-->
<!--      router.push('/homework/hot')-->
<!--      break-->
<!--    case 'mistakes':-->
<!--      router.push('/homework/mistakes')-->
<!--      break-->
<!--    default:-->
<!--      break-->
<!--  }-->
<!--}-->

<!--// 监听分页变化-->
<!--watch([currentPage, pageSize], () => {-->
<!--  fetchMistakes();-->
<!--});-->

<!--onMounted(() => {-->
<!--  fetchMistakes()-->
<!--})-->
<!--</script>-->

<!--<style scoped>-->
<!--.frequent-mistakes {-->
<!--  padding: 20px;-->
<!--  max-width: 1600px;-->
<!--  margin: 0 auto;-->
<!--  margin-top: 60px;-->
<!--}-->

<!--.layout-container {-->
<!--  display: flex;-->
<!--  gap: 20px;-->
<!--  min-height: calc(100vh - 100px);-->
<!--}-->

<!--.sidebar {-->
<!--  width: 240px;-->
<!--  background-color: #fff;-->
<!--  border-radius: 8px;-->
<!--  box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);-->
<!--  position: sticky;-->
<!--  top: 80px;-->
<!--  height: calc(100vh - 100px);-->
<!--  overflow-y: auto;-->
<!--}-->

<!--.sidebar-header {-->
<!--  padding: 15px 20px;-->
<!--  border-bottom: 1px solid #ebeef5;-->
<!--}-->

<!--.sidebar-header h3 {-->
<!--  margin: 0;-->
<!--  font-size: 16px;-->
<!--  color: #303133;-->
<!--  font-weight: 600;-->
<!--}-->

<!--.sidebar-menu {-->
<!--  border-right: none;-->
<!--}-->

<!--.main-content {-->
<!--  flex: 1;-->
<!--  min-width: 0;-->
<!--}-->

<!--.mistakes-card {-->
<!--  margin-bottom: 20px;-->
<!--}-->

<!--.card-header {-->
<!--  display: flex;-->
<!--  justify-content: space-between;-->
<!--  align-items: center;-->
<!--}-->

<!--.card-header h2 {-->
<!--  margin: 0;-->
<!--  font-size: 20px;-->
<!--  color: #303133;-->
<!--  font-weight: 600;-->
<!--}-->

<!--.filter-section {-->
<!--  margin-bottom: 20px;-->
<!--}-->

<!--.stats-section {-->
<!--  margin-bottom: 20px;-->
<!--}-->

<!--.stats-card {-->
<!--  height: 120px;-->
<!--}-->

<!--.stats-header {-->
<!--  display: flex;-->
<!--  justify-content: space-between;-->
<!--  align-items: center;-->
<!--}-->

<!--.stats-value {-->
<!--  font-size: 24px;-->
<!--  font-weight: bold;-->
<!--  color: #303133;-->
<!--  text-align: center;-->
<!--  margin-top: 10px;-->
<!--}-->

<!--.mistakes-list {-->
<!--  display: flex;-->
<!--  flex-direction: column;-->
<!--  gap: 20px;-->
<!--}-->

<!--.mistake-card {-->
<!--  margin-bottom: 20px;-->
<!--}-->

<!--.mistake-header {-->
<!--  display: flex;-->
<!--  justify-content: space-between;-->
<!--  align-items: center;-->
<!--}-->

<!--.mistake-type {-->
<!--  color: #409eff;-->
<!--  font-weight: 500;-->
<!--}-->

<!--.mistake-number {-->
<!--  color: #909399;-->
<!--}-->

<!--.mistake-content {-->
<!--  line-height: 1.6;-->
<!--}-->

<!--.mistake-text {-->
<!--  margin: 0 0 15px 0;-->
<!--  font-size: 16px;-->
<!--  color: #303133;-->
<!--}-->

<!--.mistake-options {-->
<!--  margin: 15px 0;-->
<!--}-->

<!--.option-item {-->
<!--  margin: 8px 0;-->
<!--  color: #606266;-->
<!--}-->

<!--.mistake-answer {-->
<!--  margin-top: 15px;-->
<!--  padding-top: 15px;-->
<!--  border-top: 1px solid #ebeef5;-->
<!--}-->

<!--.mistake-answer p {-->
<!--  margin: 8px 0;-->
<!--  color: #606266;-->
<!--}-->

<!--.mistake-stats {-->
<!--  margin-top: 15px;-->
<!--  display: flex;-->
<!--  gap: 10px;-->
<!--}-->

<!--.pagination-container {-->
<!--  margin-top: 20px;-->
<!--  display: flex;-->
<!--  justify-content: center;-->
<!--}-->
<!--</style>-->